
[#include "single/layout/layout02/layout.ftl"/]
[@htmlHead]
<style type="text/css">

    .bs-glyphicons-list{
        padding-left: 0;
        list-style: none;
    }
    .bs-glyphicons-list li{
        float: left;
        width: 40px;
        height: 40px;
        padding: 10px;
        font-size: 10px;
        line-height: 1.4;
        text-align: center;
        background-color: #f9f9f9;
        border: 1px solid #fff;
    }
    .bs-glyphicons-list li:hover{
        float: left;
        width: 40px;
        height: 40px;
        padding: 10px;
        font-size: 10px;
        line-height: 1.4;
        text-align: center;
        background-color: #dedede;
        border: 1px solid #fff;
    }

</style>
[/@htmlHead]
[@htmlBody]
<div id="boss-icon" class="row" style="height: 410px;overflow: auto">
    <ul class="bs-glyphicons-list" >
        <li>
            <span class="glyphicon glyphicon-asterisk" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-euro" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-eur" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-cloud" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-glass" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-music" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-heart" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-star" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-star-empty" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-account" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-film" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-th-large" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-th" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-zoom-in" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-zoom-out" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-off" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-signal" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-home" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-file" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-time" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-road" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-download" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-upload" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-inbox" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-play-circle" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-repeat" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-lock" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-flag" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-headphones" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-volume-off" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-volume-down" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-volume-up" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-qrcode" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-barcode" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-tag" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-tags" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-book" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-bookmark" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-print" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-camera" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-font" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-bold" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-italic" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-text-height" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-text-width" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-align-center" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-align-right" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-align-justify" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-list" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-indent-left" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-indent-right" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-facetime-video" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-picture" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-adjust" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-tint" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-share" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-check" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-move" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-step-backward" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-fast-backward" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-backward" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-play" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-pause" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-stop" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-forward" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-fast-forward" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-step-forward" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-eject" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-minus-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-remove-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-ok-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-question-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-screenshot" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-ok-circle" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-ban-circle" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-arrow-right" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-arrow-down" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-share-alt" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-resize-full" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-resize-small" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-gift" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-leaf" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-fire" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-eye-close" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-plane" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-random" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-magnet" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-chevron-down" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-retweet" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-folder-close" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-folder-open" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-resize-vertical" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-resize-horizontal" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-hdd" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-bullhorn" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-bell" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-certificate" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-thumbs-down" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-hand-right" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-hand-left" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-hand-up" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-hand-down" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-circle-arrow-left" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-circle-arrow-up" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-circle-arrow-down" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-globe" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-tasks" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-filter" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-briefcase" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-fullscreen" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-dashboard" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-paperclip" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-heart-empty" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-link" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-phone" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-pushpin" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-usd" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-gbp" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sort" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sort-by-alphabet" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sort-by-alphabet-alt" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sort-by-order" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sort-by-order-alt" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sort-by-attributes" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sort-by-attributes-alt" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-unchecked" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-expand" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-collapse-down" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-collapse-up" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-log-in" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-flash" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-log-out" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-new-window" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-record" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-save" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-open" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-saved" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-import" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-export" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-send" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-floppy-saved" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-floppy-remove" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-floppy-save" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-floppy-open" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-credit-card" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-transfer" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-cutlery" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-header" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-compressed" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-earphone" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-phone-alt" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-tower" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-stats" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sd-video" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-hd-video" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-subtitles" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sound-stereo" aria-hidden="true"></span>
        </li>

        <li>
            <span class="glyphicon glyphicon-sound-dolby" aria-hidden="true"></span>
        </li>
    </ul>


</div>
<div class="row navbar-fixed-bottom">
    <div class="col-xs-12 text-center">
        <input type="button" class="btn btn-info btn-sm" value="确定" onclick="top.$.bootbox.hideAll() "/>
        <input type="button" class="btn btn-cancle  btn-sm" value="关闭" onclick="top.$.bootbox.hideAll()"/>
    </div>
</div>

[/@htmlBody]
[@htmlFoot]
<script src="${jpath}/assets/public/component.js" type="text/javascript"></script>

<script type="text/javascript">
    function  IconClick(){
        $('#boss-icon .bs-glyphicons-list li').click(function () {
            var icon = $(this).find('span').attr('class');
            var idField = getQueryString('idField');
            var textField = getQueryString('textField');
            var fn = getQueryString('fn');
            if (typeof fn == 'function') {
                eval("top." + fn + "(" + icon + "," + icon + ")");
            } else {
                var contentFrame=getCurrentFrame();
                if(contentFrame){
                    var contentFrameDoc=contentFrame.document;
                    $("#" + idField, contentFrameDoc).val(icon);
                    $("#" + textField, contentFrameDoc).removeClass();
                    $("#" + textField, contentFrameDoc).addClass(icon);
                }
                else{
                    $("#" + idField, top.window.document).val(icon);
                    $("#" + textField, contentFrameDoc).removeClass();
                    $("#" + textField, top.window.document).addClass(icon);
                }
                top.$.bootbox.hideAll();
            }
        })
    }

    $(function(){
        IconClick();
    });
</script>
[/@htmlFoot]